import React, { PureComponent } from 'react';
import { UIManager, findNodeHandle, requireNativeComponent, StyleProp, ViewStyle } from 'react-native';

export default class ALIViewPlayer extends PureComponent<Props, State> {
  [x: string]: any;
  componentWillUnmount() {
    this.stopPlay();
    this.destroyPlay();
  }

  _assignRoot = (component) => {
    this._root = component;
  };

  _dispatchCommand = (command, params = []) => {
    if (this._root) {
      UIManager.dispatchViewManagerCommand(findNodeHandle(this._root), command, params);
    }
  };

  setNativeProps = (props) => {
    if (this._root) {
      this._root.setNativeProps(props);
    }
  };

  // 开始播放。
  startPlay = () => {
    this._dispatchCommand('startPlay');
  };

  // 暂停播放
  pausePlay = () => {
    this._dispatchCommand('pausePlay');
  };

  // 停止播放
  stopPlay = () => {
    this._dispatchCommand('stopPlay');
  };

  // 重载播放
  reloadPlay = () => {
    this._dispatchCommand('reloadPlay');
  };

  // 重新播放
  restartPlay = () => {
    this._dispatchCommand('restartPlay');
  };

  // 释放。释放后播放器将不可再被使用
  destroyPlay = () => {
    this._dispatchCommand('destroyPlay');
  };

  // 跳转到指定位置,传入单位为秒
  seekTo = (position = 0) => {
    if (typeof position === 'number') {
      this._dispatchCommand('seekTo', [position]);
    }
  };

  render() {
    return <RCTVideo ref={this._assignRoot} {...this.props} />;
  }
}

interface Props {
  children?: any
  style?: StyleProp<ViewStyle>
  /**
   * url
   */
  url?: string
  /**
   * vid播放地址 安卓需要JSON.stringify
   */
  source?: {
    vid: string,
    playAuth: string
  } | string
  /**
   * 设置自动播放
   */
  setAutoPlay?: boolean,
  /**
   * 设置循环播放
   */
  setLoop?: boolean,
  /**
   * 设置播放器静音
   */
  setMute?: boolean,
  /**
   * 开启硬解。默认开启
   */
  enableHardwareDecoder?: boolean,
  /**
   * 设置播放器音量,范围0~1.
   */
  setVolume?: number
  /**
   * 设置倍速播放:支持0.5~2倍速的播放
   */
  setSpeed?: number
  /**
   * 设置Referer
   */
  setReferer?: string
  /**
   * 设置UserAgent
   */
  setUserAgent?: string
  setMirrorMode?: 0 | 1 | 2, // 0:无镜像;1:横向;2:竖向
  setRotateMode?: 0 | 1 | 2 | 3, // 设置旋转 0:0度;1:90度;2:180度;3:270度;
  setScaleMode?: 0 | 1 | 2, // 设置画面缩放模式 0:宽高比适应;1:宽高比填充;2:拉伸填充;
  configHeader?: string[], // 配置自定义header
  selectBitrateIndex?: number, // 切换码率

  onAliCompletion?: (e) => void, // 播放完成事件
  onAliError?: (e) => void, // 出错事件
  onAliLoadingBegin?: (e) => void, // 缓冲开始。
  onAliLoadingProgress?: (e) => void, // 缓冲进度
  onAliLoadingEnd?: (e) => void, // 缓冲结束
  onAliPrepared?: (e) => void, // 准备成功事件
  onAliRenderingStart?: (e) => void, // 首帧渲染显示事件
  onAliSeekComplete?: (e) => void, // 拖动结束
  onAliCurrentPositionUpdate?: (e) => void, // 播放进度
  onAliBufferedPositionUpdate?: (e) => void, // 缓冲进度
  onAliAutoPlayStart?: (e) => void, // 自动播放开始
  onAliLoopingStart?: (e) => void, // 循环播放开始
  onAliBitrateChange?: (e) => void, // 切换清晰度
  onAliBitrateReady?: (e) => void, // 获取清晰度回调
}

interface State {

}

// ALIViewPlayer.defaultProps = {
//   setAutoPlay: false,
//   setScaleMode: 0,
// };

const RCTVideo = requireNativeComponent('RNAliplayer');
